<div class="row">
			 	@foreach($promotes as $k0 => $promote)
					
					@if($k0 == 0)
					<div class="col-lg-4 pr-0">
				 		<div class="card  " data-container="body" data-toggle="popover" data-placement="top" title="{{$promote->pro_name}}" data-content="特价促销:{{$promote->promote_price}}  原价:{{$promote->pro_prices}}" >
				 		  <img class="img-thumbnail" src="{{asset('productpics/').'/'.$promote->pro_img}}" alt="Card image cap">
				 		  <div style="position: absolute;top: 5px;right: 10px"><img width="30px" src="{{ asset('home/images/home/promote.png') }}"></div> 
				 		  <div class="card-body">
				 		    <h4 class="card-title" title="{{$promote->pro_name}}">{{str_limit($promote->pro_name, $limit = 18, $end = '...')}}</h4>
				 		    <p class="card-text"></p>
				 		    <a href="#" class="endtime btn btn-primary btn-block" value="{{$promote->promote_end_time}}">Go somewhere</a>
				 		  </div>
				 		</div>
				 	</div> 
					
					@endif

			 	@endforeach 


			 	 <div class="col-lg-8 pl-3" id="cuxiao">
				 	@foreach($promotes->chunk(4) as $kz=>$proms)
						<div class="row" >
				 	@foreach($proms as $z=>$p)
						@if($z == 0) @continue @endif
							<div class="col-lg-4 p-0 m-0">
								<div class="card" data-container="body" data-toggle="popover" data-placement="top" title="{{$p->pro_name}}" data-content="特价促销:{{$p->promote_price}}  原价:{{$p->pro_prices}}"  >  
								  <div class="text-center" >
								  	<img class="img-thumbnail border-0" width="245" height="245" src="{{asset('productpics/').'/'.$p->pro_img}}" alt="{{$p->pro_name}}">
								  </div>  
								  <div class="zhezhao" style="position: absolute; z-index:323;height:53px;width:100%;color:#fff;line-height:53px;text-align:center;font-size:20px;left:0; bottom: 0;background: rgba(0,0,0,.3);">
								  	{{-- {{$p->pro_name}} --}}
								  	<span class="endtime" value="{{$p->promote_end_time}}">
								  	</span>
								  </div>
								</div>

							</div>
						@endforeach

						</div>
				 	@endforeach	
			 	</div>
			 </div>
			 <script src="https://cdn.bootcss.com/popper.js/1.12.5/esm/popper.min.js"></script>
			 <script>
			 	$(function () {
			 	 $('[data-toggle="popover"]').popover({
			 	 	trigger:'hover'
			 	 })
			 	})
			 </script>
			 <script type="text/javascript">
			 		var serverTime = {{$now}} * 1000;
			 		$(function(){
			 			var dateTime = new Date();
			 			var difference = dateTime.getTime() - serverTime;

			 			setInterval(function(){

			 				$(".endtime").each(function(){
			 					var obj = $(this);
			 					var endTime = new Date(parseInt(obj.attr('value')) * 1000);
			 					var nowTime = new Date();
			 					var nMs = endTime.getTime() - nowTime.getTime() + difference;
			 					var myD = Math.floor(nMs / (1000 * 60 *60 *24)); // 天
			 					var myH = Math.floor(nMs / (1000 * 60 * 60 )) % 24; //小时
			 					var myM = Math.floor(nMs / (1000 * 60)) % 60; //分钟
			 					var myS = Math.floor(nMs / 1000) % 60;
			 					var myMS = Math.floor(nMs / 100) %10;
			 					if(myD >= 0){
			 						var str = myD + "天" + myH + "小时" + myM +"分" + myS + "." + myMS + "秒";
			 					}else{
			 						var str = "已结束!";
			 					}
			 					obj.html(str);
			 				})

			 			},100);
			 		})
			 </script>

			 {{-- <script>
			 	$(function(){
			 		$("#cuxiao").find('.col-lg-4').hover(function(){
			 			$(this).find('.zhezhao').slideDown();
			 		},function(){
			 			$(this).find('.zhezhao').slideUp();
			 		})
			 	})
			 </script> --}}